<template>
  <div class="layout-footer">
    <div class="footer"></div>
    <div class="left">
      <div class="footer-bgc">
        <div class="footer-content">
          <p class="title">全球领先的数字藏品电商平台</p>
          <p class="txt">若您和您的团队想发行推⼴数字藏品，请联系iboxservice@outlook.com</p>
          <div class="us">
            <p>联系我们</p>
            <p>商务合作</p>
            <p>关于我们</p>
            <p>用户协议</p>
          </div>
          <p class="border"></p>
        </div>
      </div>
      <div class="detail">
        <img class="icon" src="@/assets/police.png" />
        <p class="police">公网安备 15615456465456号</p>
        <p class="icp">ICP备2021003935号</p>
      </div>
      <p class="cpyr">Copyright © 2021 XXXX有限公司</p>
    </div>
  </div>
</template>
<script>
export default {
  name: 'LayoutFooter'
}
</script>
<style lang="scss" scoped>
.layout-footer {
  width: 100%;
  height: 371px;
  margin-top: 26px;
  background: #fff;

  .footer {
    height: 1px;
    background: #fff;
  }
  .left {
    margin-left: 43px;

    .footer-bgc {
      height: 240px;
      margin-left: 43px;
      background-image:url("../assets/组 8@2x.png");
      background-size:461px 238px;
      background-repeat:no-repeat;

      .footer-content {
        margin-left: 50px;

        .title {
          padding-top: 112px;
          width: 390px;
          height: 40px;
          font-size: 30px;
          font-weight: bold;
          line-height: 40px;
          color: #333;
          opacity: 1;
        }

        .txt {
          width: 421px;
          height: 17px;
          margin-top: -16px;
          font-size: 13px;
          font-weight: 400;
          line-height: 17px;
          color: #666;
          opacity: 1;
        }

        .us {
          height: 22px;
          margin-top: -13px;

          p {
            float: left;
            width: 56px;
            margin-right: 40px;
            font-size: 14px;
            font-weight: 400;
            line-height: 19px;
            color: #333;
          }
        }
      }

      .border {
        width: 94%;
        height: 0px;
        border: 1px solid #DFDBF6;
        opacity: 1;
      }
    }

    .detail {
      height: 20px;
      display: flex;
      flex-direction: row;
      align-items: center;
      margin-left: 93px;

      .police {
        width: 200px;
        height: 17px;
        margin-left: 5px;
        margin-right: 38px;
        font-size: 13px;
        font-weight: 400;
        line-height: 17px;
        color: #0066ED;
        opacity: 1;
      }

      .icp {
        width: 123px;
        height: 17px;
        font-size: 13px;
        font-weight: 400;
        line-height: 17px;
        color: #0066ED;
        opacity: 1;
      }
    }

    .cpyr {
      width: 202px;
      height: 17px;
      margin-left: 93px;
      font-size: 13px;
      font-weight: 400;
      line-height: 17px;
      color: #999;
    }
  }
}
</style>
